<template>

  <div class="dialogTicketBox">
    <popup v-model="isShow" position="bottom" height="65%" style="overflow: hidden">
      <div class="leaderBox">
        <p>选择红包</p>
        <div class="rt">
          <!--<span class="exchangeBtn" @click="goExchange()">兑换</span>-->
          <img @click="closeInit()" class="img" src="../../assets/img/cart/close.png"/>
        </div>
      </div>

      <div class="scrollerBox">
        <scroller >
          <div style="text-align: center;margin-top: .2rem;color:#999;" v-if="itemData.length==0">暂无红包</div>
          <div class="content" v-if="itemData.length>0">
            <div class="red-item" @click="chooseRedPacket()" style="display: flex;flex-direction: row;justify-content: space-between;align-items: center;background-color: #fff;padding: .2rem .4rem;">
              <div>不使用红包</div>
              <div :class="!currentRed.id?'use':'unuse'"><img src="./../../assets/img/cart/check.png" v-if="!currentRed.id"></div>
            </div>


            <div class="red-item" v-for="packet in itemData" @click="chooseRedPacket(packet)">
              <div class="top">
                <div class="left">
                  <div class="img"><img :src="packet.sellerLogo?packet.sellerLogo:require('./../../assets/img/user/shiyong.png')"></div>
                  <div class="img-right">
                    <div class="title">{{packet.sellerName}}</div>
                    <div class="limit-time">限用:{{packet.beginDate | formatDate}}</div>
                    <div class="limit-time">&nbsp&nbsp&nbsp至:{{packet.endDate | formatDate}}</div>
                  </div>
                </div>
                <div class="right">
                  <div class="price"><span>¥</span>{{packet.value}}</div>
                  <div class="limit" v-if="packet.orderAmount>0">满{{packet.orderAmount}}可用</div>
                </div>
              </div>
              <div class="center"><img src="./../../assets/img/user/ditu.png"></div>
              <div class="bottom">
                <div class="shuoming">仅供{{packet.sellerName}}店铺使用。</div>
                <div :class="packet.checked?'use':'unuse'"><img src="./../../assets/img/cart/check.png" v-if="packet.checked"></div>
                <!--<div class="unuse"></div>-->
              </div>
            </div>
          </div>
        </scroller>
      </div>
    </popup>

  </div>

</template>
<script src="./panel.js"></script>
<style lang="less" scoped>
  @import "./panel";
</style>
